import React, { useEffect, useState } from 'react'
interface Props {

}

const RetTop = (props: Props) => {
    const [show, switchShow] = useState(false);
    useEffect(() => {
        const listener = () => {
            switchShow(window.scrollY > 300)
        }
        document.addEventListener('scroll', listener);
        return () => document.removeEventListener('scroll', listener); // 组件销毁后，取消监听
    }, [show] /* 依赖记得给上，否则死循环 */)
    const returnTop = () => {
        setTimeout(() => {
            window.scrollTo(0, 0)
        }, 1000);
    }
    return show ? (
        <div className="top-jumper" onClick={() => returnTop()}>
            <span className="text"> </span>
        </div>) : null;
}

export default RetTop
